<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@include file="../base/base.jspf" %>
<div class="layui-form" style="padding: 10px 0 0 50px;">
    <input type="hidden" name="roeId" value="${role.roeId}"/>
    <input type="hidden" id="role-roleSubmitPage-ids" name="ids" value="${ids}"/>
    <div class="layui-col-xs6" style="position: fixed;">
        <div class="layui-form-item">
            <label class="layui-form-label">角色名称:</label>
            <div class="layui-input-inline">
                <c:if test='${!empty role.roeId}'>
                    <input type="hidden" id="role-old-roleName" value="${role.roeName}"/>
                </c:if>
                <input type="text" value="${role.roeName}" name="roeName" lay-verify="required|roleNameExist"
                       placeholder="请输入角色名称"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label ">权限描述</label>
            <div class="layui-input-inline">
                <textarea name="roeDescription"
                          class="layui-textarea">${role.roeDescription}</textarea>
            </div>
        </div>
    </div>
    <div class="layui-col-xs6" style="float: right;">
        <div class="text-center">
            <ul id="role-roleSubmitPage-ztree" class="ztree"></ul>
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit id="role-front-submit" lay-filter="role-front-submit" value="确认"/>
    </div>
</div>
<script type="text/javascript">
    layui.config({
        base: "${ctx}/static/framework/layuiadmin/" //静态资源所在路径
    }).extend({
        index: "lib/index" //主入口模块
    }).use(["index", "form"], function () {
        var form = layui.form;

        form.verify({
            roleNameExist: function (value, item) { //value：表单的值、item：表单的DOM对象
                if (${empty role.roeId}) {
                    if (verificationData("roleNameExist", value)) {
                        return value + "已存在";
                    }
                } else {
                    if ($("#role-old-roleName").val() != value && verificationData("roleNameExist", value)) {
                        return value + "已存在";
                    }
                }
            }
        });
        form.on("submit(role-front-submit)", function (data) {
            $("#person-front-submit").attr("disabled",true);
            tip_index = load();
            var field = data.field; //获取提交的字段
            $.ajax({
                async: true,
                url: "${ctx}/role/roleSubmit",
                type: "post",
                dataType: "json",
                data: field,
                success: function (data) {
                    layer.close(tip_index);
                    if (data.result) {
                        parentTableReload("role-roleList-page");
                        successUp(data.info);
                        closeDialog();
                    } else {
                        $("#person-front-submit").attr("disabled",false);
                        error(data.info);
                    }
                }
            });
        });

        var setting_ztree = {
            data: {
                simpleData: {
                    enable: true
                }
            },
            check: {
                enable: true,
                chkboxType: {
                    "Y": "ps",
                    "N": "ps"
                }
            },
            callback: {
                onClick: zTreeOnClick
            }
        };

        function initCheckNode() {
            var ids = $("#role-roleSubmitPage-ids").val();
            if (ids) {
                var zTree = $.fn.zTree.getZTreeObj("role-roleSubmitPage-ztree");
                ids = ids.split(",");
                for (var i = 0; i < ids.length; i++) {
                    var resId = ids[i];
                    var node = zTree.getNodeByParam("id", resId, null);
                    if (node) {
                        zTree.checkNode(node, true, false, false);
                    }
                }
            }
        }

        function showTreeForRole() {
            $.ajax({
                async: false,
                url: "${ctx}/resource/getAssResTree",
                type: "post",
                dataType: "json",
                data: {
                    enable: "1"
                },
                success: function (data) {
                    $.fn.zTree.init($("#role-roleSubmitPage-ztree"), setting_ztree, data);
                    var ztree = $.fn.zTree.getZTreeObj("role-roleSubmitPage-ztree");
                    ztree.expandNode(ztree.getNodes()[0], true, false, false, false);
                }
            });
        }

        function zTreeOnClick(event, treeId, treeNode) {
            var ztree = $.fn.zTree.getZTreeObj("role-roleSubmitPage-ztree");
            if (treeNode.checked) {
                ztree.checkNode(treeNode, false, true, false);
            } else {
                ztree.checkNode(treeNode, true, true, false);
            }
        }

        $(function () {
            showTreeForRole();
            initCheckNode();
        });
    });

    function getIds() {
        var zTree = $.fn.zTree.getZTreeObj("role-roleSubmitPage-ztree");
        var resId = zTree.getCheckedNodes();
        if (resId.length > 0) {
            var res_id = null;
            var ids = "";
            for (var i = 0; i < resId.length; i++) {
                res_id = resId[i].id;
                if (res_id != "0") {
                    ids += "," + res_id;
                }
            }
            $("#role-roleSubmitPage-ids").val(ids.substring(1));
        } else {
            $("#role-roleSubmitPage-ids").val("");
        }
    }
</script>